<template>
	<view class="page">
		<image src="https://hzybucket.obs.cn-south-1.myhuaweicloud.com/we_chat/top-bg.png" class="bg-color"
			mode="aspectFill"></image>
		<!--  refresher-only @onRefresh="onRefresh"    只要下拉 -->
		<z-paging ref="paging" @scroll="pagScroll"
			:bg-color="scrollTop > 100 ? 'rgba(240, 240, 240,1)' : 'rgba(240, 240, 240,0)'">
			<!-- 之后-vue3 -->
			<template #top>
				<uv-navbar :bgColor="scrollTop > 100 ? '#fff' : 'rgba(0,0,0,0)'" autoBack :fixed="false"
					title=""></uv-navbar>
			</template>
			<block #refresher="{ refresherStatus }">
				<custom-refresher :status="refresherStatus" />
			</block>
			<view class="bg-img-box">
				<image src="https://hzybucket.obs.cn-south-1.myhuaweicloud.com/we_chat/add.png" class="image"
					mode="aspectFill">
				</image>
				<view class="title">
					<text class="title-1">专业</text>
					装修定制
				</view>
				<view class="desc">— 海量户型方案 更省心 更划算 —</view>
			</view>
			<!-- 内容 -->
			<view class="content-box ios">
				<uv-form labelPosition="top" :model="formData" :rules="rules" ref="form" labelWidth="auto">
					<uv-form-item label="装修类型" prop="zxType.name" borderBottom required @click="showSelect('type')">
						<uv-input v-model="formData.zxType.name" disabled disabledColor="#ffffff" placeholder="请选择装修类型"
							border="none"></uv-input>
						<template v-slot:right>
							<uv-icon name="arrow-right"></uv-icon>
						</template>
					</uv-form-item>
					<uv-form-item label="是否勘场" prop="survey_site" borderBottom required v-if="detailData.id">
						<uv-radio-group v-model="formData.survey_site" :disabled="detailData.status > 1010">
							<uv-radio :customStyle="{ margin: '8px' }" v-for="(item, index) in radioList" :key="index"
								:label="item.name" :name="item.name">
								<template v-slot:icon></template>
							</uv-radio>
						</uv-radio-group>
					</uv-form-item>
					<uv-form-item label="勘场约定日期" prop="survey_date" v-if="formData.survey_site == '勘场出图'" borderBottom
						required @click="showSelect('date')">
						<uv-input :disabled="detailData.status > 1010" v-model="formData.survey_date" disabled
							disabledColor="#ffffff" placeholder="请选择勘场约定日期" border="none"></uv-input>
						<template v-slot:right>
							<uv-icon name="arrow-right"></uv-icon>
						</template>
					</uv-form-item>
					<uv-form-item label="设计师" prop="designer_id" v-if="formData.survey_site == '勘场出图'" borderBottom
						required @click="showSelect('designer')">
						<uv-input :disabled="detailData.status > 1010" v-model="formData.designer_id" disabled
							disabledColor="#ffffff" placeholder="请选择设计师" border="none"></uv-input>
						<template v-slot:right>
							<uv-icon name="arrow-right"></uv-icon>
						</template>
					</uv-form-item>
					<uv-form-item label="项目名称" prop="project_name" borderBottom required v-if="detailData.id">
						<uv-input v-model="formData.project_name" border="none" placeholder="请输入项目名称"></uv-input>
					</uv-form-item>
					<uv-form-item label="姓名" prop="name" borderBottom required>
						<uv-input v-model="formData.name" border="none" placeholder="请输入真实姓名"></uv-input>
					</uv-form-item>
					<uv-form-item label="联系电话" prop="phone" borderBottom required>
						<uv-input v-model="formData.phone" border="none" placeholder="请输入联系电话"></uv-input>
					</uv-form-item>
					<uv-form-item label="所在地区" prop="city" borderBottom required @click="showSelect('city')">
						<uv-input v-model="formData.city" disabled disabledColor="#ffffff" placeholder="请选择所在地区"
							border="none"></uv-input>
						<template v-slot:right>
							<uv-icon name="arrow-right"></uv-icon>
						</template>
					</uv-form-item>
					<uv-form-item label="详细地址" prop="address" borderBottom required>
						<uv-input v-model="formData.address" border="none" placeholder="请输入详细地址"></uv-input>
					</uv-form-item>
					<uv-form-item v-if="detailData.id" label="品牌经理经理" prop="channel_manager_id" borderBottom required
						@click="showSelect('manager')">
						<uv-input v-model="formData.channel_manager_id" disabled disabledColor="#ffffff"
							placeholder="请选择品牌经理经理" border="none"></uv-input>
						<template v-slot:right>
							<uv-icon name="arrow-right"></uv-icon>
						</template>
					</uv-form-item>
					<uv-form-item label="项目品牌" prop="brank" borderBottom required @click="showSelect('brank')">
						<uv-input v-model="formData.brank" disabled disabledColor="#ffffff" placeholder="请选择项目品牌"
							border="none"></uv-input>
						<template v-slot:right>
							<uv-icon name="arrow-right"></uv-icon>
						</template>
					</uv-form-item>
					<uv-form-item required label="其他品牌" prop="brankOther" borderBottom
						v-if="formData.brankData.id == 'other'">
						<uv-input v-model="formData.brankOther" border="none" placeholder="请输入其他品牌"></uv-input>
					</uv-form-item>
					<uv-button type="primary" :text="detailData.id ? '完善' : '提交'" customStyle="margin-top: 30px"
						@click="submit"></uv-button>
				</uv-form>
			</view>
			<view class="ios"></view>
		</z-paging>
	</view>
	<!-- 装修类型 -->
	<uv-picker ref="typePicker" :columns="data.typeColumns" keyName="name"
		@confirm="pickerConfirm($event, 'type')"></uv-picker>
	<!-- 品牌选择 -->
	<uv-picker ref="brankPicker" :columns="brankColumns" keyName="name"
		@confirm="pickerConfirm($event, 'brank')"></uv-picker>
	<!-- 省市区选择 -->
	<uv-picker ref="cityPicker" :columns="cityColumns" keyName="name" @confirm="pickerConfirm($event, 'city')"
		@change="cityChange"></uv-picker>
	<!-- 品牌经理经理 -->
	<uv-picker ref="managerPicker" :columns="channelManagerList" keyName="name"
		@confirm="pickerConfirm($event, 'manager')" @change="cityChange"></uv-picker>
	<!-- 年月日选择 -->
	<uv-datetime-picker :formatter="formatter" ref="datetimePicker" :value="formData.survey_date" mode="date"
		@confirm="pickerConfirm($event, 'date')"></uv-datetime-picker>
	<!-- 设计师 -->
	<uv-picker ref="designerPicker" :columns="designerList" keyName="name" @confirm="pickerConfirm($event, 'designer')"
		@change="cityChange"></uv-picker>
</template>

<script setup>
	import {
		array,
		object,
		mobile,
		empty
	} from '@/uni_modules/uv-ui-tools/libs/function/test.js';
	import {
		ref,
		reactive,
		toRefs,
		toRef,
		getCurrentInstance,
		onMounted
	} from 'vue';
	import {
		onShow,
		onReady,
		onLoad,
		onPageScroll
	} from '@dcloudio/uni-app';
	const {
		proxy: that
	} = getCurrentInstance();
	onReady(() => {
		//onReady 为uni-app支持的生命周期之一
		that.$refs.datetimePicker.setFormatter(formatter)
	})
	onLoad((e) => {
		uni.setNavigationBarColor({
			frontColor: data.scrollTop > 100 ? '#000000' : '#ffffff',
			backgroundColor: '#ffffff',
			animation: {
				duration: 400,
				timingFunc: 'easeIn'
			}
		});
		let userInfo = uni.getStorageSync('userInfo');
		data.formData.name = userInfo.name;
		data.formData.phone = userInfo.phone;
		if (e.data) {
			console.log(JSON.parse(e.data), "项目详情数据")
			data.detailData = JSON.parse(e.data); //详情数据
			data.formData.name = JSON.parse(e.data).customer_name; //客户名称
			data.formData.phone = JSON.parse(e.data).customer_phone; //客户手机
			data.formData.address = JSON.parse(e.data).address; //详细地址
			// 是否勘场
			if (JSON.parse(e.data).survey_site == 1) {
				data.formData.survey_site = '无需勘场'
			}
			if (JSON.parse(e.data).survey_site == 2) {
				data.formData.survey_site = '勘场出图'
			}
			// 勘场日期
			data.formData.survey_date = JSON.parse(e.data).survey_date || timestampToDateFormat(Number(
				new Date()));
			// 装修类型
			let typeColumns = data.typeColumns;
			let typeIndex = typeColumns[0].findIndex(item => {
				return item.id == JSON.parse(e.data).project_type
			})
			data.formData.zxType = typeColumns[0][typeIndex];
			that.$refs.typePicker.setIndexs([typeIndex], true);
			data.formData.project_name = JSON.parse(e.data).project_name || ''; //项目名
			console.log(data.formData, "shujv")
			getBrandList(); //品牌
			wxGetAreaList(); //省市区
			wxGetAdminList(); //品牌经理经理x
			designerListFunc(); //设计师
		} else {
			data.formData.survey_date = timestampToDateFormat(Number(new Date())); //默认今天
			getBrandList(); //品牌
			wxGetAreaList(); //省市区
		}
	});

	onReady(() => {
		that.$refs.form.setRules(data.rules);
	})
	const data = reactive({
		dataList: [],
		scrollTop: 0,
		formData: {
			zxType: '',
			name: '',
			phone: '',
			city: '',
			cityData: '',
			address: '',
			brank: '',
			brankData: '',
			brankOther: '',
			project_name: '',
			channel_manager_id: '',
			channel_manager_data: {},
			survey_site: '',
			survey_date: '',
			designer_data: '',
			designer_id: ''
		},
		rules: {
			'zxType.name': {
				required: true,
				message: '请选择装修类型',
				trigger: ['blur', 'change']
			},
			name: {
				required: true,
				message: '请填写姓名',
				trigger: ['blur', 'change']
			},
			phone: {
				validator: (rule, value, callback) => {
					return mobile(value);
				},
				required: true,
				message: '请填写正确手机号',
				trigger: ['blur', 'change']
			},
			city: {
				required: true,
				message: '请选择所在地区',
				trigger: ['blur', 'change']
			},
			address: {
				required: true,
				message: '请选择详细地址',
				trigger: ['blur', 'change']
			},
			brankOther: {
				required: true,
				message: '请输入你想要的其他品牌',
				trigger: ['blur', 'change']
			},
			project_name: {
				required: true,
				message: '请输入项目名',
				trigger: ['blur', 'change']
			},
			survey_date: {
				required: true,
				message: '请选择勘场日期',
				trigger: ['blur', 'change']
			},
			survey_site: {
				required: true,
				message: '请选择是否勘场',
				trigger: ['blur', 'change']
			},
			designer_id: {
				required: true,
				message: '请选择设计师',
				trigger: ['blur', 'change']
			},
			channel_manager_id: {
				required: true,
				message: '请选择品牌经理经理',
				trigger: ['blur', 'change']
			},
		},
		areaList: [],
		cityColumns: [],
		brankColumns: [],
		radioList: [{
			name: '无需勘场',
			id: 1,
		}, {
			name: '勘场出图',
			id: 2,
		}],
		typeColumns: [
			[{
				name: '新店',
				id: 1,
			}, {
				name: '改造店',
				id: 2,
			}, {
				name: '翻新店',
				id: 3,
			}, {
				name: '特批新店',
				id: 4,
			}, {
				name: '特批改造店',
				id: 5,
			}, {
				name: '特批对接店',
				id: 6,
			}]
		],
		detailData: {},
		channelManagerList: [], //品牌经理经理
		designerList: [], //设计师
	});
	let {
		dataList,
		scrollTop,
		formData,
		rules,
		brankColumns,
		cityColumns,
		areaList,
		brankData,
		cityData,
		radioList,
		detailData,
		channelManagerList,
		designerList,
	} = toRefs(data);

	function dateFormatToTimestamp(data) {
		// const date = new Date(data); // 获取当前日期对象
		// const timestamp = date.getTime(); // 获取时间戳
		return Date.parse(data);
	}

	function timestampToDateFormat(timestamp) {
		const dateObj = new Date(timestamp); // 创建Date对象
		const year = String(dateObj.getFullYear()); // 获取年份
		const month = String(dateObj.getMonth() + 1).padStart(2, "0"); // 获取月份，并补零
		const day = String(dateObj.getDate()).padStart(2, "0"); // 获取日期，并补零

		return year + "-" + month + "-" + day; // 返回转换后的日期格式
	}

	function pagScroll(e) {
		data.scrollTop = e.detail.scrollTop;
		uni.setNavigationBarColor({
			frontColor: e.detail.scrollTop > 100 ? '#000000' : '#ffffff',
			backgroundColor: '#ffffff',
			animation: {
				duration: 400,
				timingFunc: 'easeIn'
			}
		});
	}

	function queryList(page, num) {
		setTimeout(() => {
			that.$refs.paging.complete([]);
		}, 3000);
	}

	function formatter(type, value) {
		if (type === 'year') {
			return `${value}年`
		}
		if (type === 'month') {
			return `${value}月`
		}
		if (type === 'day') {
			return `${value}日`
		}
		return value
	}
	let showSelect = (type) => {
		switch (type) {
			case 'type':
				that.$refs.typePicker.open();
				break;
			case 'city':
				that.$refs.cityPicker.open();
				break;
			case 'manager':
				that.$refs.managerPicker.open();
				break;
			case 'brank':
				that.$refs.brankPicker.open();
				break;
			case 'date':
				that.$refs.datetimePicker.open();
				break;
			case 'designer':
				that.$refs.designerPicker.open();
				break;
			default:
		}
	}

	function pickerConfirm(e, type) {
		switch (type) {
			case 'type':
				data.formData.zxType = e.value[0];
				that.$refs.form.validateField("zxType.name");
				break;
			case 'brank':
				data.formData.brank = e.value[0].name;
				data.formData.brankData = e.value[0];
				that.$refs.form.validateField("brank");
				break;
			case 'city':
				data.formData.city = e.value[0].name + e.value[1].name + e.value[2].name;
				data.formData.cityData = e.value;
				that.$refs.form.validateField("city");
				break;
			case 'manager':
				data.formData.channel_manager_id = e.value[0].name;
				data.formData.channel_manager_data = e.value[0];
				that.$refs.form.validateField("channel_manager_id");
				break;
			case 'date':
				if (data.detailData.status > 1010) return;
				data.formData.survey_date = timestampToDateFormat(e.value);
				break;
			case 'designer':
				if (data.detailData.status > 1010) return;
				data.formData.designer_id = e.value[0].name;
				data.formData.designer_data = e.value[0];
				that.$refs.form.validateField("designer_id");
				break;
		}
		console.log(e, type, data.formData)
	}
	// 获取频偏
	let getBrandList = () => {
		let detailData = data.detailData;
		that.$Api.getBrandList({
			page: 1,
			num: 9999
		}).then(res => {
			console.log(res, "品牌列表")
			if (res.code == 200) {
				res.data.list.push({
					name: '其他品牌',
					id: 'other'
				})
				data.brankColumns.push(res.data.list);
				if (!detailData.id) return;
				if (!detailData.brand_id) {
					data.formData.brank = '其他品牌';
					data.formData.brankOther = detailData.brand_name;
					data.formData.brankData = res.data.list[res.data.list.length - 1];
					that.$refs.brankPicker.setIndexs([res.data.list.length - 1], true);
				} else {
					let index = res.data.list.findIndex(item => {
						return item.id == detailData.brand_id;
					})
					if (index != -1) {
						data.formData.brank = res.data.list[index].name;
						data.formData.brankData = res.data.list[index];
						that.$refs.brankPicker.setIndexs([index], true);
					}
				}
			}
		})
	}
	// 省市区列表
	let wxGetAreaList = () => {
		let detailData = data.detailData;
		that.$Api.wxGetAreaList().then(res => {
			console.log(res, "省市区")
			if (res.code == 200) {
				data.areaList = res.data;
				data.cityColumns = [res.data, res.data[0].children, res.data[0].children[0].children]
				if (!data.detailData.id) return;
				let province_arr = [];
				let province_index = 0;
				let city_arr = [];
				let city_index = 0;
				let county_arr = [];
				let county_index = 0;
				if (detailData.province_id) {
					let index = res.data.findIndex(item => {
						return item.id == detailData.province_id;
					})
					province_arr = res.data;
					province_index = index;
				}
				if (detailData.city_id) {
					city_arr = province_arr[province_index].children;
					let index = city_arr.findIndex(item => {
						return item.id == detailData.city_id;
					})
					city_index = index;
				}
				if (detailData.county_id) {
					county_arr = city_arr[city_index].children;
					let index = county_arr.findIndex(item => {
						return item.id == detailData.county_id;
					})
					county_index = index;
				}
				data.cityColumns = [province_arr, city_arr, county_arr];
				that.$refs.cityPicker.setIndexs([province_index, city_index, county_index], true);

				data.formData.city = province_arr[province_index].name + city_arr[city_index].name +
					county_arr[county_index].name;
				data.formData.cityData = [
					province_arr[province_index],
					city_arr[city_index],
					county_arr[county_index]
				];
			}
		})
	}
	let cityChange = (e) => {
		const {
			columnIndex,
			index,
			indexs
		} = e
		let areaList = data.areaList;
		if (columnIndex == 0) {
			let arr1 = areaList || [];
			let arr2 = areaList[index].children || [];
			let arr3 = areaList[index].children[0].children || [];
			data.cityColumns = [];
			arr1 ? data.cityColumns.push(arr1) : '';
			arr2 ? data.cityColumns.push(arr2) : '';
			arr3 ? data.cityColumns.push(arr3) : '';
			// 省
			that.$refs.cityPicker.setIndexs([index, 0, 0], true)
		} else if (columnIndex == 1) {
			// 市
			let arr1 = areaList || [];
			let arr2 = areaList[indexs[0]].children || [];
			let arr3 = areaList[indexs[0]].children[indexs[1]].children || [];
			data.cityColumns = [];
			arr1 ? data.cityColumns.push(arr1) : '';
			arr2 ? data.cityColumns.push(arr2) : '';
			arr3 ? data.cityColumns.push(arr3) : '';
			that.$refs.cityPicker.setIndexs([indexs[0], indexs[1], 0], true)
		}
	}
	let submit = () => {
		let formData = data.formData;
		console.log(formData)
		// 如果有错误，会在catch中返回报错信息数组，校验通过则在then中返回true
		that.$refs.form
			.validate()
			.then((res) => {
				let obj = {
					project_type: formData.zxType.id,
					province_id: formData.cityData[0].id,
					city_id: formData.cityData[1].id,
					county_id: formData.cityData[2].id,
					address: formData.address,
					customer_name: formData.name,
					customer_phone: formData.phone

				};
				if (formData.brankData.id == 'other') {
					obj.brand_name = formData.brankOther;
					obj.brand_id = 0;
				} else {
					obj.brand_id = formData.brankData.id;
					obj.brand_name = formData.brankData.name;
				}
				if (data.detailData.id) {
					project_name: formData.project_name, //项目名
					obj.project_id = data.detailData.id; //项目id
					obj.survey_site = formData.survey_site == '勘场出图' ? 2 : 1; //是否勘场
					obj.survey_date = formData.survey_date; //约定勘场日期
					// 设计师
					obj.designer_id = formData.designer_data.id || '';
					obj.designer_name = formData.designer_data.name || '';
					// 品牌经理经理
					obj.channel_manager_id = formData.channel_manager_data.id;
					obj.channel_manager_name = formData.channel_manager_data.name;
					obj.remark = '';
				}
				console.log(JSON.parse(JSON.stringify(obj)), "提交项目参数11111")
				uni.showLoading({
					mask: true,
					title: '提交中，请稍等'
				})
				// 修改完善
				if (data.detailData.id) {
					updProject(obj);
					return;
				}
				// 添加
				that.$Api.wxAddProject(obj).then(res => {
					console.log(res, "添加项目")
					uni.hideLoading()
					if (res.code == 200) {
						uni.showToast({
							title: '操作成功~',
							icon: 'success'
						})
						setTimeout(() => {
							uni.reLaunch({
								url: '/pagesA/project/project'
							})
						}, 500)
					} else {
						uni.showToast({
							title: res.message,
							icon: 'error'
						})
					}
				}).catch(err => {
					uni.hideLoading()
					uni.showToast({
						title: err.message,
						icon: 'error'
					})
				})
			})
			.catch((errors) => {});
	}
	// 完善项目
	let updProject = (data) => {
		that.$Api.updProject(data).then(res => {
			console.log(res, "完善项目")
			uni.hideLoading()
			if (res.code == 200) {
				uni.showToast({
					title: '操作成功~',
					icon: 'success'
				})
				// 获取当前页面栈数组
				const pages = getCurrentPages();
				// 获取栈顶页面的实例
				const prevPage = pages[pages.length - 2]; //上一页
				prevPage.$vm.$.exposed.getProjectDetails(prevPage.$vm.$.exposed.data.dataObj.id);
				// console.log(prevPage.$vm.$.exposed, "页面栈")
				setTimeout(() => {
					uni.navigateBack();
				}, 500)
			} else {
				uni.showToast({
					title: res.message,
					icon: 'error'
				})
			}
		}).catch(err => {
			uni.hideLoading()
			uni.showToast({
				title: err.message,
				icon: 'error'
			})
		})
	}
	//获取品牌经理经理
	let wxGetAdminList = () => {
		let detailData = data.detailData;
		var obj = {
			page: 1,
			num: 9999,
			keyword: "",
			province_id: "",
			city_id: "",
			county_id: "",
			identity: 3,
			position_id_arr: [],
		}
		that.$Api.wxGetAdminList(obj).then(res => {
			console.log(res, "品牌经理经理列表")
			if (res.code == 200) {
				data.channelManagerList.push(res.data.list);
				let index = res.data.list.findIndex(item => {
					return item.id == data.detailData.channel_manager_id;
				})
				if (index != -1) {
					data.formData.channel_manager_id = res.data.list[index].name;
					data.formData.channel_manager_data = res.data.list[index];
					that.$refs.managerPicker.setIndexs([index], true);
				}
			}
		}).catch(err => {
			uni.hideLoading()
		})
	}
	//获取设计师
	let designerListFunc = () => {
		let detailData = data.detailData;
		uni.showLoading({
			mask: true
		})
		var obj = {
			page: 1,
			num: 9999,
			keyword: "",
			province_id: "",
			city_id: "",
			county_id: "",
			identity: 1,
			position_id_arr: [3],
		}
		that.$Api.wxGetAdminList(obj).then(res => {
			console.log(res, "设计师列表")
			uni.hideLoading()
			if (res.code == 200) {
				data.designerList.push(res.data.list);
				let index = res.data.list.findIndex(item => {
					return item.id == data.detailData.designer_id;
				})
				if (index != -1) {
					data.formData.designer_id = res.data.list[index].name;
					data.formData.designer_data = res.data.list[index];
					that.$refs.designerPicker.setIndexs([index], true);
				}
			}
		}).catch(err => {
			uni.hideLoading()
		})
	}
</script>

<style lang="scss" scoped>
	.page {
		position: relative;
		width: 100%;
		background: #f0f0f0;
		height: 100vh;
	}

	.bg-color {
		width: 100%;
		height: 708rpx;
		position: fixed;
	}

	::v-deep .z-paging-content {
		transition: all 0.2s;
	}

	.bg-img-box {
		width: 100%;
		position: relative;
		top: 0;
		left: 0;

		.image {
			position: absolute;
			top: 0;
			right: 50rpx;
			width: 416rpx;
			height: 250rpx;
		}

		.title {
			font-weight: 600;
			font-size: 42rpx;
			color: #101010;
			margin: 12rpx 0 0 54rpx;
			position: relative;
			z-index: 1;

			.title-1 {
				font-weight: 600;
				font-size: 58rpx;
				color: #004bff;
			}
		}

		.desc {
			width: 398rpx;
			height: 40rpx;
			background: #3b75ff;
			border-radius: 20rpx;
			font-weight: 500;
			font-size: 24rpx;
			color: #ffffff;
			line-height: 40rpx;
			text-align: center;
			margin: 18rpx 0 0 54rpx;
			position: relative;
			z-index: 1;
		}
	}

	.content-box {
		width: calc(100% - 50rpx);
		margin: 100rpx 25rpx 20rpx;
		background-color: #fff;
		position: relative;
		z-index: 9;
		border-radius: 40rpx;
		padding: 52rpx 30rpx;
		box-sizing: border-box;

		::v-deep .uv-radio__icon-wrap {
			width: 26rpx !important;
			height: 26rpx !important;
		}

		::v-deep .uv-form-item__body__left {
			margin-bottom: 22rpx !important;
		}

		::v-deep .uv-form-item__body__left__content__label {
			margin-left: 10rpx;
		}

		::v-deep .uv-button {
			width: 634rpx !important;
			height: 108rpx !important;
			background: #3b75ff !important;
			border-radius: 16rpx !important;
		}

		::v-deep .uv-button__text {
			font-weight: 500 !important;
			font-size: 32rpx !important;
			color: #ffffff !important;
		}
	}
</style>